<template>
	<!-- 企业详情 -->
	<view class="content">
		<view class="empty"></view>
		<view class="head">
			<view class="img">
				<image :src="prefileUr" mode="scaleToFill"></image>
			</view>
			<span>{{firmName}}</span>
			<view class="comfirm">
				<view id="round"></view>
				<span>企业认证</span>
			</view>
			<view class="location">
				<span>{{location}}{{' '}}|{{' '}}{{num}}个在招职位</span>
			</view>
		</view>
		
		
		<uTabs :list="list"
		lineWidth="30"
		lineColor="#08C8BD"
		:activeStyle="{
		color: '#303133',
		fontWeight: 'bold',
		transform: 'scale(1.05)'
		}" 	@click="TabsClick"></uTabs>
			
		<!-- 企业信息 -->
		<view class="firmCard" v-show="showWhich==0">
			<firm-card></firm-card>
		</view>
		<!-- 在招岗位 -->
		<view v-show="showWhich==1">
			<job-card class="jobCard" v-for="item,index in jobCardList" :key="index"></job-card>
		</view>
		
		
	</view>
</template>

<script>
	import firmCard from '@/subpageB/components/firmCard.vue'
	import jobCard from '@/subpageB/components/jobCard.vue'
	import uTabs from '@/subpageB/uview-ui/components/u-tabs/u-tabs.vue'
	
	export default {
		data() {
			return {
				entId: 0,
				prefileUr:'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8568e76c-23c5-4d05-bd27-7ff891e61576/31791c1b-36c7-42f1-851b-c73a2565e92d.png',
				firmName:"企业名称",
				location:"东莞",
				jobCardList:[1,1,1,1],
				showWhich:0,
				list:[{
                    name: '企业信息',
                }, {
                    name: '在招职位',
                }]
				
			};
		},
		components:{
			firmCard,
			jobCard,
			uTabs
		},
		computed:{
			num(){
				return this.jobCardList.length;
			}
		},
		onLoad(option) {
			if(option.entId) {
				this.entId = option.entId
			}
			this.getQuery()
		},
		methods:{
			TabsClick(val){
				//console.log(val);
				this.showWhich=val.index;
			},
			getQuery() {
				console.log(this.entId)
				this.$store.dispatch('initDic').then(() => {
					this.$http.request({
						url:'/enterprise/enterpriseInfo',
						data:{
							"entId": this.entId
						}
					}).then(result=>{
						let res=result.data
						console.log(res)
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	
	.content{
		position: relative;
		width: 100%;
		min-height: 100vh;
		padding: 1rpx 0;
		background-color: #F3F7F8;
		background-image: url('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8568e76c-23c5-4d05-bd27-7ff891e61576/31791c1b-36c7-42f1-851b-c73a2565e92d.png');
		background-size: 100%;
		background-repeat: no-repeat;
		.empty{
			width: 100%;
			height: 240rpx;
		}
		.head{
			position: relative;
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 100%;
			height:282rpx ;
			background: #FFFFFF;
			border-radius: 8px 8px 0px 0px;
			
			.img{
				position: absolute;
				top: -64rpx;
				image{
					width: 128rpx;
					height: 128rpx;
					border-radius: 16rpx;
					opacity: 1;
					border: 2px solid #FFFFFF;
				}
			}
			>span{
				margin-top: 96rpx;
				font-size: 20px;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 500;
				color: #000000;
			}
			.comfirm{
				background: #E8FFFE;
				border-radius: 4px 4px 4px 4px;
				
				#round{
					display: inline-block;
					border: 8rpx solid #00D3C7;
					width: 0;
					height: 0;
					border-radius: 8rpx;
				}
				span{
					font-size: 12px;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #00D3C7;
					margin: 6rpx 10rpx;
				}
			}
			.location{
				span{
					font-size: 14px;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #505E5C;
				}
				
			}
		}
	
		
		
	}
</style>
